<extend name="desktop_default/template/base_index2" />

<block name="area_header">
	<style type="text/css">
        body{
            background: #FFFFFF;
        }
		.all {
			height: 1100px;
		}
		.tops{
			height: 100px;
			border-bottom: 2px solid orangered;
		}
		.userinfo{margin-left: 65%; margin-top: -25px; font-size: 13px;}
        .all a{ color: #000000;}
		 .order-info{ height: 150px;background-color: #FFFFFF; margin: 0 auto; width: 990px; padding: 30px;}
		 .fl{float: left; height: 100%; float: 60%; margin-left: 20px;}
		 .fr{float: right; height: 100%; width: 30%; }
		 .order-detail{background-color: #FFFFFF; margin: 0 auto; width: 990px; padding-left: 80px; padding-top: 20px; padding-bottom: 20px;}
		 .order-detail ul li{ list-style: none;}
		 .content{padding-left: 30px; padding-top: 5px; }
		 .paytype{margin-top: 20px; padding: 30px;background-color: #FFFFFF;margin: 0 auto; height: 500px; width: 990px;}


	</style>
</block>

<block name="area_body">
	<include file="desktop_default/width/right" />
   <include file="desktop_default/width/top"/>
	
	<div class=" container ">
		{:W('Partials/nav_group')}
	</div><br>

    <include file="desktop_default/partial/buy_step" step="3" />

	<div class="all shop-container">
		
		<div class="order-info clearfix">
			<i class="am-icon-check-square-o" style="font-size: 53px; float: left; color: green;"></i>
			<div class="fl">
				
				<font size="5" class="title">您的订单已提交成功！</font>
				<p class="post-info" id="J_postInfo">
					收货信息：{$address.contactname} {$address.mobile} &nbsp;&nbsp; {$address.province}&nbsp;&nbsp;{$address.city}&nbsp;&nbsp;{$address.area}&nbsp;&nbsp;{$address.detailinfo} </p>
			</div>
			<div class="fr">
				<p class="total">
					应付总额：<span class="money">{$zongjia+$youfei}元</span>
				</p>
				<a href="javascript:void(0);" class="show-detail" id="J_showDetail" >订单详情<i class="am-icon-chevron-down"></i></a>
			</div>
		</div>
		<div class="order-detail" style="display: none;" >
			<ul>
				<li class="clearfix">
					<div class="label">订单号：</div>
					<div class="content">
						<span class="order-num">
                           {$ordercode}                                
						</span>
					</div>
				</li>
				<li class="clearfix">
					<div class="label">收货信息：</div>
					<div class="content">
						{$address.contactname} {$address.mobile} &nbsp;&nbsp; {$address.province}&nbsp;&nbsp;{$address.city}&nbsp;&nbsp;{$address.area}&nbsp;&nbsp;{$address.detailinfo}</div>
				</li>
				<li class="clearfix" style="border: 1px dashed #F5F5F5;">
					<div class="label">商品名称：</div>
					<table>
					<volist name="items" id="vo">
						<tr>
							<td><img style=""
								<if condition="$isnull eq 0">
								 src="{:U('Api/Picture/index',array('id'=>$vo['icon_url']))}"
								 <else/>
								 src="{:U('Api/Picture/index',array('id'=>$vo['img']))}"
								 </if>
								 height="80" width="80"></td>
							<td>{$vo.name}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
							<td>{$vo.sku_desc}&nbsp;&nbsp;&nbsp;&nbsp;</td>
							<td style="color: red;">{$vo.price}元</td>
							<td>x{$vo.count}</td>
						</tr>
					</volist>
						</table>
				</li>
				<li class="clearfix">
					<div class="label">配送时间：</div>
					<div class="content">
						不限送货时间 </div>
				</li>
				<li class="clearfix">
					<div class="label">发票信息：</div>
					<div class="content">
						个人 </div>
				</li>
			</ul>
		</div><br><button id="ispay" style="opacity: 0;" data-am-modal="{target: '#doc-modal-1', closeViaDimmer: 0, width: 480, height: 325}"></button>
		<div class="paytype">
			<h2>请选择支付方式</h2>
			<hr>
			<h3>支付平台</h3>
			<div style="height: 70px; width: 160px; float: left;">
				<a href="{:U('Shop/GAlipay/pay?key='.$key.'&desc='.$desc.'&code='.$code.'&name='.$name.'&total_price='.$total_price)}">
                    <img height="100%" width="100%" src="__IMG__/182x64.png" />
                </a>
            </div>
			
		</div>
        <br><br>
	</div>
	
	<div class="am-modal am-modal-no-btn" tabindex="-1" id="doc-modal-1">
  <div class="am-modal-dialog">
    <div class="am-modal-hd">正在支付...
      <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
    </div>
    <div class="am-modal-bd">
      <img style="height: 150px; width: 150px; float: left; margin-top: 30px;" src="__IMG__/mitu.png">
      	<div style="height: 250px; width: 250px; float: right; padding: 30px;">
      		支付成功了？<br><a style="color: orangered;" href="{:U('Shop/User/order')}">查看订单信息>></a>
      		<hr>
      		支付失败了？<br><a style="color: orangered;" href="{:U('Shop/Article/index')}">查看支付失败常见问题>></a>
      	</div>
    </div>
  </div>
</div>
	<include file="desktop_default/width/floor" />
</block>

<block name="area_footer">
	<script type="text/javascript">
		$(function(){
			$('.order-detail').hide();
		})

	</script>
</block>
